
import React, { useState ,useEffect } from 'react';
import "./Particulars.scss"
import { Button, } from 'antd';
import type { SizeType } from 'antd/es/config-provider/SizeContext';
import pic from "../../../assets/669.png"
import { Rate } from 'antd';
import * as service from "../../../api/index"
import { useParams } from 'react-router-dom';
import { useNavigate } from 'react-router-dom'
interface Props {

}
function Particulars(props: Props) {
     var [pingjia,setPingjia]=useState([])
     var [list,setlist]:any=useState()
     var [arr,setarr]:any=useState()
     var params=useParams()
    const navigator=useNavigate()
     //发请求去获取评价详情
  
        var [xing,setxing]:any=useState()
     const xiangqing = async()=>{
        var res=await service.Zixun_xiangqig({id:params.id})
        console.log(res)
        list=res.data.shujv
        setlist(res.data)
        xing=res.data.xingji
  
        setxing(res.data.xingji)
        setarr(res.data.xuanxiang)
        console.log(arr)
     }
      useEffect(()=>{
        console.log(params)
        xiangqing()
      },[])

       
   
    // 关闭
    const huitui=()=>{
        navigator(-1)
    }
       
    //  setPingjia(arr)
    const [small, setSize,] = useState<SizeType>('large');
    return (
        <div className='Particulars'>
            <div className='header'>
                <p>  办事指南评价详情</p>
                <div className='header_right'>
                    <Button type="primary" size={small}>回复</Button>
                    <Button onClick={huitui} size={small}>关闭</Button>
                </div>
            </div>
            <div className='nav'>
                <div className='left_header1'>
                    <p>基本信息</p>
                </div>
                <div className='message'>

                    <div className='left'>
                        <div>评价事项</div>
                        <div>评价人</div>
                        <div>联系电话</div>
                    </div>
                    <div className='right'>
                        <div>{list&&list.headline}</div>
                        <div>{list&&list.name}</div>
                        <div>{list&&list.phone}</div>
                    </div>
                </div >
                <div className='pingjia'>
                    <div className='left_header2'>
                        <p>评价信息</p>
                  

                    </div>
                    <div className='pingjia_nav'>
                              <div className='header2'>用户信息</div>
                              <div className='pingjia_nav_buttom'>
                                  <img src={pic} alt="" />
                                 <div className='right'>
                                      <div className='pingjia_nav_buttom_right'>
                                          <p>用户评价</p>
                                          <p>{ list&&list.textnav}</p>
                                          <p>{list&&list.name}{list&&list.time}</p>
                                          <Rate allowHalf defaultValue={4} />;<span>{list&&list.xingji==5?"非常满意":(list&&list.xingji==4?"基本满意":(list&&list.xingji==3?"不满意":"非常不满意"))}</span>
                                          <div className='pj'>
                                            {
                                               arr&&arr.map((item:any,index:any)=>{
                                                    return (
                                                        <div className='pingjia'>{item}</div>
                                                    )
                                                })
                                            }
                                          </div>
                                      </div>
                                      <div className='pingjia_nav_buttom_right2'>
                                          <p>部门回复</p>
                                
                                          <Rate allowHalf defaultValue={2.5} />;<span>基本满意</span>
                                          <div>
                                        
                                          {list&&list.huifunav}
                                          </div>
                                      </div>
                                    
                                 </div>
                              </div>
                        </div>
                </div>
            </div>
        </div>
    );
}

export default Particulars;